<div class="dashboard-group">

  <!-- 次级头部层 -->
  <div class="adminPanel-header">
    <div class="adminPanel-title">管理面板</div>
    <div class="adminPanel-button">
      <button apes-button (click)="onEvent('add')">创建面板</button>
      <!--<button apes-button apesType="default" (click)="closePanel()">返回当前面板</button>-->
    </div>
  </div>

  <!-- 主体层 -->
  <div class="adminPanel-content">
    <div class="adminPanel-content-left">
      <div class="adminPanel-content-text active">我的面板</div>
      <!--<div class="adminPanel-content-text">默认面板</div>-->
    </div>
    <div class="adminPanel-content-right">
      <div class="adminPanel-title">我的面板</div>
      <div class="adminPanel-subhead">此页面允许您管理您拥有的全部仪表板。</div>
      <div class="adminPanel-content-main">
        <div class="main-header">
          <div class="main-name">名称</div>
          <div class="main-remarks">备注</div>
          <!--<div class="main-tool"></div>-->
        </div>
        <ng-container *ngFor="let list of allCanvas,let i = index">
          <div class="main-body">
            <div class="main-name" (click)="showPanel(i)">{{list.name}}</div>
            <div class="main-remarks">{{list.description}}</div>
            <div class="main-tool">
              <apes-dropdown [apesPlacement]="'bottom'" [apesTrigger]="'click'">
                <i class="anticon anticon-setting" apes-dropdown></i>
                <ul apes-menu>
                  <li apes-menu-item (click)="onEvent('edit',i)">
                    <span>编辑</span>
                  </li>
                  <li apes-menu-item (click)="onEvent('del',i)">
                    <span>删除</span>
                  </li>
                  <li apes-menu-item (click)="onEvent('copy',i)">
                    <span>复制</span>
                  </li>
                </ul>
              </apes-dropdown>
            </div>
          </div>
        </ng-container>
      </div>
    </div>
  </div>

</div>

<!-- 创建面板 -->
<!--<apes-modal [(apesVisible)]="addPanelVisible"-->
            <!--[apesTitle]="panelTitle"-->
            <!--[apesContent]="panelContent"-->
            <!--[apesWidth]="400"-->
            <!--[apesFooter]="null"-->
            <!--[apesClassName]="'panel-main'"-->
            <!--(apesOnCancel)="closePanelDialog()">-->
  <!--<ng-template #panelTitle>-->
    <!--创建新面板-->
  <!--</ng-template>-->

  <!--<ng-template #panelContent>-->
    <!--<div class="modal-panel-main">-->
      <!--<div class="modal-panel-content">-->

        <!--&lt;!&ndash; 名称 &ndash;&gt;-->
        <!--&lt;!&ndash;<apes-form-item>&ndash;&gt;-->
          <!--&lt;!&ndash;<apes-form-label apes-col [apesMd]="6" apesRequired apesFor="email">名称</apes-form-label>&ndash;&gt;-->
          <!--&lt;!&ndash;<apes-form-control apes-col [apesMd]="18">&ndash;&gt;-->
            <!--&lt;!&ndash;<input type="text" apes-input [(ngModel)]="panelName"/>&ndash;&gt;-->
          <!--&lt;!&ndash;</apes-form-control>&ndash;&gt;-->
        <!--&lt;!&ndash;</apes-form-item>&ndash;&gt;-->

        <!--&lt;!&ndash; 描述 &ndash;&gt;-->
        <!--&lt;!&ndash;<apes-form-item>&ndash;&gt;-->
          <!--&lt;!&ndash;<apes-form-label apes-col [apesMd]="6" apesRequired apesFor="email">描述</apes-form-label>&ndash;&gt;-->
          <!--&lt;!&ndash;<apes-form-control apes-col [apesMd]="18">&ndash;&gt;-->
            <!--&lt;!&ndash;<textarea rows="2" apes-input [(ngModel)]="narrate"></textarea>&ndash;&gt;-->
          <!--&lt;!&ndash;</apes-form-control>&ndash;&gt;-->
        <!--&lt;!&ndash;</apes-form-item>&ndash;&gt;-->

        <!--&lt;!&ndash; 岗位权限 &ndash;&gt;-->
        <!--&lt;!&ndash;<apes-form-item>&ndash;&gt;-->
          <!--&lt;!&ndash;<apes-form-label apes-col [apesMd]="6" apesRequired apesFor="email">岗位权限</apes-form-label>&ndash;&gt;-->
          <!--&lt;!&ndash;<apes-form-control apes-col [apesMd]="18">&ndash;&gt;-->
            <!--&lt;!&ndash;<ng-select&ndash;&gt;-->
              <!--&lt;!&ndash;clearAllText&ndash;&gt;-->
              <!--&lt;!&ndash;[items]="postData"&ndash;&gt;-->
              <!--&lt;!&ndash;bindLabel="name"&ndash;&gt;-->
              <!--&lt;!&ndash;bindValue="name"&ndash;&gt;-->
              <!--&lt;!&ndash;[notFoundText]="'无法找到'"&ndash;&gt;-->
              <!--&lt;!&ndash;typeToSearchText&ndash;&gt;-->
              <!--&lt;!&ndash;[loading]="contractLoading"&ndash;&gt;-->
              <!--&lt;!&ndash;[multiple]="true"&ndash;&gt;-->
              <!--&lt;!&ndash;[typeahead]="contractinput$"></ng-select>&ndash;&gt;-->
          <!--&lt;!&ndash;</apes-form-control>&ndash;&gt;-->
        <!--&lt;!&ndash;</apes-form-item>&ndash;&gt;-->

        <!--&lt;!&ndash; 个人权限 &ndash;&gt;-->
        <!--&lt;!&ndash;<apes-form-item>&ndash;&gt;-->
          <!--&lt;!&ndash;<apes-form-label apes-col [apesMd]="6" apesRequired apesFor="email">个人权限</apes-form-label>&ndash;&gt;-->
          <!--&lt;!&ndash;<apes-form-control apes-col [apesMd]="18">&ndash;&gt;-->
            <!--&lt;!&ndash;<ng-select&ndash;&gt;-->
              <!--&lt;!&ndash;clearAllText&ndash;&gt;-->
              <!--&lt;!&ndash;[items]="userData"&ndash;&gt;-->
              <!--&lt;!&ndash;bindLabel="name"&ndash;&gt;-->
              <!--&lt;!&ndash;bindValue="name"&ndash;&gt;-->
              <!--&lt;!&ndash;[notFoundText]="'无法找到'"&ndash;&gt;-->
              <!--&lt;!&ndash;typeToSearchText&ndash;&gt;-->
              <!--&lt;!&ndash;[loading]="contractLoading"&ndash;&gt;-->
              <!--&lt;!&ndash;[multiple]="true"&ndash;&gt;-->
              <!--&lt;!&ndash;[virtualScroll]="true"&ndash;&gt;-->
              <!--&lt;!&ndash;[typeahead]="contractinput$"></ng-select>&ndash;&gt;-->
          <!--&lt;!&ndash;</apes-form-control>&ndash;&gt;-->
        <!--&lt;!&ndash;</apes-form-item>&ndash;&gt;-->

        <!--&lt;!&ndash;<ng-container *ngFor="let item of data">&ndash;&gt;-->
          <!--&lt;!&ndash;<apes-form-item>&ndash;&gt;-->
            <!--&lt;!&ndash;<apes-form-label apes-col [apesMd]="6" apesRequired apesFor="email">{{item.name}}</apes-form-label>&ndash;&gt;-->
            <!--&lt;!&ndash;<apes-form-control apes-col [apesMd]="18">&ndash;&gt;-->
              <!--&lt;!&ndash;<ng-select&ndash;&gt;-->
                <!--&lt;!&ndash;clearAllText&ndash;&gt;-->
                <!--&lt;!&ndash;[items]="itemData"&ndash;&gt;-->

                <!--&lt;!&ndash;bindLabel="name"&ndash;&gt;-->
                <!--&lt;!&ndash;bindValue="name"&ndash;&gt;-->
                <!--&lt;!&ndash;[notFoundText]="'无法找到'"&ndash;&gt;-->
                <!--&lt;!&ndash;typeToSearchText&ndash;&gt;-->
                <!--&lt;!&ndash;[loading]="contractLoading"&ndash;&gt;-->
                <!--&lt;!&ndash;[multiple]="true"&ndash;&gt;-->
                <!--&lt;!&ndash;[typeahead]="contractinput$"></ng-select>&ndash;&gt;-->
            <!--&lt;!&ndash;</apes-form-control>&ndash;&gt;-->
          <!--&lt;!&ndash;</apes-form-item>&ndash;&gt;-->
        <!--&lt;!&ndash;</ng-container>&ndash;&gt;-->

        <!--&lt;!&ndash; 按钮 &ndash;&gt;-->
        <!--&lt;!&ndash;<apes-form-item>&ndash;&gt;-->
          <!--&lt;!&ndash;<button apes-button (click)="addPanel()">创建</button>&ndash;&gt;-->
          <!--&lt;!&ndash;<button apes-button (click)="closePanelDialog()">关闭</button>&ndash;&gt;-->
        <!--&lt;!&ndash;</apes-form-item>&ndash;&gt;-->

        <!--&lt;!&ndash;<div apes-form [formGroup]="form">&ndash;&gt;-->

          <!--<add-panel [forms]="form"></add-panel>-->

          <!--&lt;!&ndash; 按钮 &ndash;&gt;-->
          <!--<apes-form-item>-->
            <!--<button apes-button (click)="addPanel()">创建</button>-->
            <!--<button apes-button (click)="closePanelDialog()">关闭</button>-->
          <!--</apes-form-item>-->

        <!--&lt;!&ndash;</div>&ndash;&gt;-->

      <!--</div>-->
    <!--</div>-->
  <!--</ng-template>-->
<!--</apes-modal>-->


